<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>哔哩哔哩logo</title>
    <link rel="stylesheet" href="./iconfont/iconfont.css">
    <link rel="stylesheet" href="./index.css">
</head>
<body>
    <div class="stage">
        
    </div>
    <script>
        const stage = document.querySelector('.stage');
        let html = '';
        for(let i = 20;i>0;i--){
            html += `<div class="layer">
                <p style='transform:translateZ(${(i-1)*-1.5}px);'>
                    <i class='iconfont icon-bilibili-fill'></i>
                    <i class='iconfont icon-bilibili'></i>
                </p>
            </div>`
        }
        stage.innerHTML = html;
    </script>
</body>
</html>